//
// Tabs
// --------------------------------------------------

.nav-tabs > li > a {
	.border-radius(0) !important;
}

.box-tabs {
	.nav-tabs {
		border-bottom: none;
		position: relative;
		top: -41px;
		margin-right: 0;
		overflow: hidden;

		> li {
			margin-left: 1px;
			float: right;

			&.active {
				> a {
					&:hover, &:focus {
						background-color: #fff;
					}
				}
			}

			> a {
				padding-top: 8px;
				padding-bottom: 10px;
				line-height: 12px;
				margin-top: 0px;
				.border-radius(0);

				&:hover, &:focus {
					background-color: rgba(255, 255, 255, 0.7);
				}

				&.active {
					background-color: #fff;
				}
			}
		}
	}

	.tab-content {
		margin-top: -30px;
	}
}

.tabbable-custom {
	.border-radius(0);
	margin-bottom: 15px;

	> .nav-tabs {
		border: none;
		margin: 0px;

		> li {
			margin-right: 2px;
			border-top: 2px solid transparent;

			&.active {
				border-top: 3px solid @mainColor;
				margin-top: 0;
				position: relative;

				> a {
					border-top: none;
					font-weight: 400;

					&:hover, &:active {
						background-color: #fff;
					}
				}
			}

			> a {
				margin-right: 0;
				padding: 5px 10px;

				&:hover, &:active {
					background-color: @grayLighter;
				}
			}
		}
	}

	> .tab-content {
		background-color: #fff;
		border: 1px solid #ddd;
		.border-radius(0);
		padding: 10px;
		overflow: auto;
	}

	&.tabbable-full-width {
		.nav-tabs > li > a {
			font-size: (@baseFontSize + 2px);
			padding: 8px 20px;
			color: @textColor;
		}

		> .tab-content {
			border-left: none;
			border-right: none;
			border-bottom: none;
			padding: 20px 0;
		}
	}
}

/* * * * * * * * * * * *
 * Tabs Below
 * * * * * * * * * * * */

.tabs-below.tabbable-custom {
	> .nav-tabs {
		li {
			border-top: none;
			border-bottom: 2px solid transparent;
			margin-top: -1px;

			&.active {
				border-top: none;
				border-bottom: 3px solid @mainColor;
				margin-bottom: 0;
				position: relative;

				a, a:hover, a:focus {
					border-bottom: none;
				}
			}

			a {
				&:hover, &:focus {
					border-bottom: 1px solid #eee;
				}
			}
		}
	}
}

/* * * * * * * * * * * *
 * Tabs Left
 * * * * * * * * * * * */

.tabs-left.tabbable-custom {
	> .nav-tabs {
		float: left;

		li {
			border-left: 3px solid transparent;
			margin-right: 0;
			margin-top: 0;

			&.active {
				border-top: none;
				border-left: 3px solid @mainColor;
				margin-top: 0;
				margin-right: -1px;
				position: relative;

				a {
					border-top: 1px solid #ddd;
					border-left: 1px solid transparent;
				}
			}

			a {
				&:hover, &:focus {
					border-bottom: 1px solid #eee;
					border-right: none;
				}
			}
		}
	}
}

/* * * * * * * * * * * *
 * Tabs Right
 * * * * * * * * * * * */

.tabs-right.tabbable-custom {
	> .nav-tabs {
		float: right;

		li {
			border-right: 3px solid transparent;
			margin-right: 0;
			margin-top: 0;

			&.active {
				border-top: none;
				border-right: 3px solid @mainColor;
				margin-top: 0;
				margin-right: -1px;
				position: relative;

				a {
					border-top: 1px solid #ddd;
					border-right: 1px solid transparent;
				}
			}

			a {
				margin-left: -1px;

				&:hover, &:focus {
					border-bottom: 1px solid #eee;
				}
			}
		}
	}
}

/* * * * * * * * * * * *
 * Tabs Left & Right
 * * * * * * * * * * * */

.tabs-right.tabbable-custom .nav-tabs > li a, .tabs-left.tabbable-custom .nav-tabs > li a {
	padding: 8px 10px;
}

.tabs-left > .nav-tabs > li, .tabs-right > .nav-tabs > li {
	float: none;

	> a {
		min-width: 74px;
		margin-right: 0;
		margin-bottom: 3px;
	}
}

.tabs-left > .nav-tabs .active > a, .tabs-left > .nav-tabs .active > a:hover, .tabs-left > .nav-tabs .active > a:focus {
	border-color: #ddd transparent #ddd #ddd;
}

.tabs-right > .nav-tabs .active > a, .tabs-right > .nav-tabs .active > a:hover, .tabs-right > .nav-tabs .active > a:focus {
	border-color: #ddd #ddd #ddd transparent;
}